<!-- 个人信息 -->
<template>
	<view class="setting">
		<view class="setting-top">
			<view class="u-f-jsb u-f-ac avatar-box" @tap="changeAvater">
				<view class="u-f-ac">
					<view class="avatar round"><image :src="userInfo.memberAvatar ? userInfo.memberAvatar : '../../../../static/logo.jpg'" class="round" @tap.stop="lookAvater"></image></view>
				</view>
				<view>
					<text class="tip-text">修改头像</text>
					<text class="icon iconfont icon-right"></text>
				</view>
			</view>
		</view>
		<form @submit="save">
			<view class="radius20 bg-white padding">
				<view class="u-f-jsb u-f-ac set-li">
					<text>登录账号</text>
					<view>
						<text class="mr8">{{ userInfo.memberAccount }}</text>
					</view>
				</view>
				<view class="u-f-jsb u-f-ac set-li">
					<text>个人名称</text>
					<input type="text" placeholder="请输入个人名称" maxlength="25" name="receiverName" placeholder-style="color:#aaa;" />
				</view>
				<view class="u-f-jsb u-f-ac set-li">
					<text>邮箱</text>
					<input type="text" placeholder="请输入个人邮箱" maxlength="25" name="email" placeholder-style="color:#aaa;" />
				</view>
				<view class="u-f-jsb u-f-ac set-li">
					<text>性别</text>
					<radio-group class="radio-group" @change="radioChange">
						<label class="tui-radio">
							<radio value="0" color="#2ba4f7" />
							男
						</label>

						<label class="tui-radio">
							<radio value="1" color="#2ba4f7" />
							女
						</label>
					</radio-group>
				</view>
				<picker mode="date" :value="date" :start="startDate" :end="endDate" @change="bindDateChange">
					<view class="u-f-jsb u-f-ac set-li">
						<text>生日</text>
						<view>
							<text class="tip-text" v-if="userInfo.birthday == null">请设置</text>
							<text v-else>{{ userInfo.birthday }}</text>
							<text class="icon iconfont icon-right"></text>
						</view>
					</view>
				</picker>
				<view class="u-f-jsb u-f-ac set-li" @tap="addrmap">
					<text>常住地</text>
					<view>
						<text :class="address ? '' : 'tip-text'">{{ address ? address : '请设置' }}</text>
						<text class="icon iconfont icon-right"></text>
					</view>
				</view>
				<button type="primary" form-type="submit" class="submitBtn">确定</button>
			</view>
		</form>
	</view>
</template>

<script>
import chooseImg from '@/common/js/upload/uploadFile.js'
import { locationAuth } from '@/common/js/utils/authorize.js';
import { getDate } from '@/common/js/utils/date.js';
export default {
	data() {
		return {
			date: '',
			userInfo: {},
			address: '',
			startDate: getDate('start'),
			endDate: getDate('end')
		};
	},
	methods: {
		// 更改头像
		changeAvater() {
			// 获取本地图片上传到阿里云
			chooseImg(1,res=>{
				// this.imgurl = res
				console.log(res,'---------------')
			},)
		},
		// 设置生日按确定按钮，触发
		bindDateChange: function(e) {
			console.log(e.detail.value);
		},
		// 设置居住地
		addrmap() {
			let that = this;
			locationAuth(function(res) {
				that.address = res.address;
			});
		}
	}
};
</script>

<style lang="scss" scoped>
.setting-top .avatar-box {
	padding: 30rpx 28rpx;
}
.mr8 {
	margin-right: 16rpx;
}
.set-li{
	padding:28rpx 0 !important;
}
.set-li .icon {
	display: inline !important;
	width: 1em !important;
}
.set-li text {
	width: 150rpx;
}
.tip-text {
	color: #aaa;
}
.icon-right {
	margin-left: 20rpx;
}
.set-li input {
	flex: 1;
}
</style>
